<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pt-br">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="author" content="Edy Segura" />
<meta name="reply-to" content="edy@segura.pro.br" />
<meta name="description" content="Componente javascript para uso de um filtro em uma lista" />
<title>Componente FilterList.js</title>

<!-- stylesheet -->
<link rel="stylesheet" href="css/style.css" type="text/css" title="Layout Padrão" />

<!-- javascript -->
<script type="text/javascript" src="http://jscomponentes.googlecode.com/svn/trunk/DOM-Kit/js/DOM-Kit/DOM-Kit.js"></script>
<script type="text/javascript" src="js/FilterList/FilterList.js"></script>
<script type="text/javascript" src="js/Index.js"></script>

</head>
<body>

<h1>Componente FilterList.js</h1>
<p>
	Componente javascript para uso de um filtro em uma lista. 
	Para mais detalhes veja o código fonte.<br />
	Ou se preferir faça o 
	<a href="http://files.edysegura.com/labs/filter-list.zip">download</a> deste 
	<a href="http://files.edysegura.com/labs/filter-list.zip">exemplo</a>.
</p>

<div id="listPlanoDeVendas" class="liveSearch">
	<label for="filterPlanoDeVendas">
		Plano de Vendas: 
		<input type="text" id="filterPlanoDeVendas" />
	</label>
	<div class="listFiltered">
		<ul>
			<li>
				<a href="#id=1&amp;date=09-07-2008" title="Data criação: 09/07/2008">TRATAMENTO DA AGUA DO RIO SAPUCAI</a>
			</li>
			<li class="even">
				<a href="#id=2&amp;date=09-07-2008" title="Data criação: 09/07/2008">SALÁRIO MILIONÁRIO</a>
			</li>
			<li>
				<a href="#5" title="Data criação: 09/07/2008">LUZ</a>
			</li>
			<li class="even">
				<a href="#7" title="Data criação: 09/07/2008">teste juliana outro</a>
			</li>
			<li>
				<a href="#12" title="Data criação: 09/07/2008">TESTE CADASTRO</a>
			</li>
			<li class="even">
				<a href="#13" title="Data criação: 09/07/2008">PLANO CUSTO FIXO CONFINAMENTO DE BOI</a>
			</li>
			<li>
				<a href="#14" title="Data criação: 09/07/2008">Bê</a>
			</li>
			<li class="even">
				<a href="#15" title="Data criação: 23/07/2008">VENDA DE MORTADELA 2008 (ENERGIA)</a>
			</li>
			<li>
				<a href="#16" title="Data criação: 23/07/2008">VENDA DE MORTADELA 2008 (MOD)</a>
			</li>
			<li class="even">
				<a href="#19" title="Data criação: 25/07/2008">desaghdasgf</a>
			</li>
			<li>
				<a href="#20" title="Data criação: 25/07/2008">ADaDaD</a>
			</li>
			<li class="even">
				<a href="#22" title="Data criação: 25/07/2008">novo</a>
			</li>
			<li>
				<a href="#23" title="Data criação: 25/07/2008">CUSTO CARREGADOR CELULAR</a>
			</li>
		</ul>
	</div>
	<div class="close">Fechar</div>
</div>

<div id="listPlanoCustoFixo" class="liveSearch">
	<label for="filterCustoFixo">
		Plano de Custo Fixo: 
		<input type="text" id="filterCustoFixo" />
	</label>
	<div class="listFiltered">
		<ul>
			<li>
				<a href="#id=1&amp;date=09-07-2008" title="Data criação: 09/07/2008">TRATAMENTO DA AGUA DO RIO SAPUCAI</a>
			</li>
			<li class="even">
				<a href="#id=2&amp;date=09-07-2008" title="Data criação: 09/07/2008">SALÁRIO MILIONÁRIO</a>
			</li>
			<li>
				<a href="#5" title="Data criação: 09/07/2008">LUZ</a>
			</li>
			<li class="even">
				<a href="#7" title="Data criação: 09/07/2008">teste juliana outro</a>
			</li>
			<li>
				<a href="#12" title="Data criação: 09/07/2008">TESTE CADASTRO</a>
			</li>
			<li class="even">
				<a href="#13" title="Data criação: 09/07/2008">PLANO CUSTO FIXO CONFINAMENTO DE BOI</a>
			</li>
			<li>
				<a href="#14" title="Data criação: 09/07/2008">Bê</a>
			</li>
			<li class="even">
				<a href="#15" title="Data criação: 23/07/2008">VENDA DE MORTADELA 2008 (ENERGIA)</a>
			</li>
			<li>
				<a href="#16" title="Data criação: 23/07/2008">VENDA DE MORTADELA 2008 (MOD)</a>
			</li>
			<li class="even">
				<a href="#19" title="Data criação: 25/07/2008">desaghdasgf</a>
			</li>
			<li>
				<a href="#20" title="Data criação: 25/07/2008">ADaDaD</a>
			</li>
			<li class="even">
				<a href="#22" title="Data criação: 25/07/2008">novo</a>
			</li>
			<li>
				<a href="#23" title="Data criação: 25/07/2008">CUSTO CARREGADOR CELULAR</a>
			</li>
		</ul>
	</div>
	<div class="close">Fechar</div>
</div>

</body>
</html>
